/* Centriranje celog body elementa */

/* Glavni kontejner: Fiksna širina 800px, centriran */
main {
    display: flex;
    flex-direction: column; 
    align-items: center;    
    width: 800px; /* KLJUČNO: Fiksna širina 800px */
    margin: 0 auto; 
}

/* Kontejner za dinamičke slike */
#slike-kontejner {
    display: flex; 
    justify-content: center; 
    align-items: center; 
    width: 100%; 
    margin-bottom: -5px; 
    min-height: 200px; /* Opciono */
}

/* Stil za JEDNU sliku u punom formatu unutar 800px */
.nasumicna-slika {
    max-width: 100%; /* Slika zauzima maksimalno 800px */
    height: auto; 
    border-radius: 8px; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Stilizovanje iFrame kontejnera */
#iframe-kontejner {
    width: 100%; 
}

/* NOVI STIL: Kontejner koji "odseca" vizuelni vrh iFrame-a */
#vizuelni-klip {
    /* Visina iFrame-a (1135px-XXXpx) je ovde definisana kao vidljivi prozor */
    height: 800px; 
    overflow: hidden; /* Sadržaj koji je van ove visine se sakriva (odseca) */
    position: relative; /* Postavljanje relativne tačke */
    border: 1px solid #ccc; 
    margin: 10px auto;
}

#vizuelni-klip iframe {
    width: 100%; 
    
    /* Ukupna visina iFrame-a: Vidljiva visina (1095) + Odsečeni vrh (40) = 1135px */
    height: 800px; 
    
    /* Pomeramo iFrame GORE za 235px (negativna margina), odsecajući vrh */
    margin-top: -0px;     
    display: block; 
}

html {
	background: url(..\\pozadina.jpg) no-repeat center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	overflow-y: -moz-scrollbars-vertical;
    overflow-y: scroll;
    -webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow:0 0 10px rgba(0, 0, 0, 0.5);

}

#header { 											/* Stilovi za sekcije - stil zaglavlja */
	font-size : 12px; 
	font-weight : bold; 
	margin-bottom : 5px; 
	padding-bottom : 3px; 
	width : 100%; 
	background-image : url('BeloOzad.gif'); 
	background-position:top center; 
	background-repeat: repeat-y; 
    margin-left: auto;
    margin-right: auto;
    -webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
	display: inline-table;
}

body { 														/* celo telo HTML-a, osnovna podešavanja */
	font-family : Tahoma, Arial, Helvetica, sans-serif; 
	font-size : 11px; 
	margin-top : 5px; 
	padding-top : 3px; 
    margin-left: auto;
    margin-right: auto;
    -webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
    display: flex;
}


#navigation, #navigation1 {
  background       : #fff;
  font-size        : 14px; 
  width            : 760px;
  line-height      : 14px; 
  margin           : 0px auto;
  padding          : 15px 25px 0 15px;
  -webkit-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
}

/* #navigation table td:first-child, #navigation1 table td:first-child {
} */
    
#navigation1 table a, #navigation table a {
  border-radius    : 10px 10px 0 0;
  color            : #fff;
  font-size        : 12px;
  font-weight      : bold;
/* hieronder het rechter getal aanpassen voor een smallere link. Standaard 30px */    
  padding          : 10px 10px;
  margin-right     : -13px;
  -webkit-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
/*   text-transform   : uppercase; */
}

#navigation1 table a:nth-of-type(1), #navigation table a:nth-of-type(1),
#navigation1 table a:nth-of-type(2), #navigation table a:nth-of-type(2),
#navigation1 table a:nth-of-type(3), #navigation table a:nth-of-type(3),
#navigation1 table a:nth-of-type(4), #navigation table a:nth-of-type(4),
#navigation1 table a:nth-of-type(5), #navigation table a:nth-of-type(5),
#navigation1 table a:nth-of-type(6), #navigation table a:nth-of-type(6),
#navigation1 table a:nth-of-type(7), #navigation table a:nth-of-type(7),
#navigation1 table a:nth-of-type(8), #navigation table a:nth-of-type(8),
#navigation1 table a:nth-of-type(9), #navigation table a:nth-of-type(9),
#navigation1 table a:nth-of-type(10), #navigation table a:nth-of-type(10),
#navigation1 table a:nth-of-type(11), #navigation table a:nth-of-type(11)
{
  background       : DodgerBlue;
  -webkit-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:0 0 30px rgba(0, 0, 0, 0.5);
  box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
}

#navigation1 a:hover, #navigation a:hover { color : yellow; font-size : 14px; font-weight : bold;border-bottom : 5px solid yellow; padding-bottom : 5px; } /* navigacioni meni, boja, kontrast, font */
#navigation1 a:active, #navigation a:active  { color : orange; border-bottom : 15px solid yellow; padding-bottom : 0px; }
#navigation1 td, #navigation td { color : black; padding : 0 5px; }